<template>
	<view class="adList p30">
		<view class="list" v-if="list.length">
			<view class="item card p20" v-for="item in list" :key="item.id">
				<view class="itemCard dis">
					<view class="itemL">展示学校：</view>
					<view class="itemR">{{ item.departmentName || '--' }}</view>
				</view>
				<view class="itemCard dis">
					<view class="itemL">展示页面：</view>
					<view class="itemR">{{ item.position || '--' }}</view>
				</view>
				<view class="itemCard dis">
					<view class="itemL">标题：</view>
					<view class="itemR">{{ item.title || '--' }}</view>
				</view>
				<view class="itemCard dis">
					<view class="itemL">类型：</view>
					<view class="itemR">{{ item.type || '--' }}</view>
				</view>
				<view class="itemCard dis">
					<view class="itemL">背景颜色：</view>
					<view class="itemR">{{ item.backgroundColor || '--' }}</view>
				</view>
				<view class="itemCard dis">
					<view class="itemL">字体颜色：</view>
					<view class="itemR">{{ item.color || '--' }}</view>
				</view>
				<view class="itemCard dis">
					<view class="itemL">跳转链接：</view>
					<view class="itemR">{{ item.link || '--' }}</view>
				</view>
				<view class="itemCard dis">
					<view class="itemL">链接地址：</view>
					<view class="itemR">{{ item.suffix || '--' }}</view>
				</view>
				<view class="itemImg" v-if="item.imageUrl" @click="bigImg(item.imageUrl)">
					<image :src="item.imageUrl" mode="aspectFill"></image>
				</view>
				<view class="itemBut dis">
					<view class="delBut butItem" @click="delItem(item.id)">删除</view>
					<!-- <view class="editBut butItem">修改</view> -->
				</view>
			</view>
			<view class="noData">没有更多了~</view>
		</view>
		<view class="noData" v-else>暂无数据</view>
		<view class="addVest dis" @click="open"><up-icon name="plus" color="#fff" size="30rpx"></up-icon></view>
	</view>
	<up-modal content="确定要删除吗？" title="" :show="showModal" contentTextAlign="center" confirmButtonShape="circle">
		<template #confirmButton>
			<view class="modalBut dis">
				<view class="custom_btn nodeBut" @click="noDel">取消</view>
				<view class="custom_btn" @click="okDel">确定</view>
			</view>
		</template>
	</up-modal>
</template>

<script setup>
import { getAdList2, delAd } from '@/config/api.js';
import { uploadImage } from '@/util/util.js';
import { ref } from 'vue';
import { onShow, onLoad, onReachBottom } from '@dcloudio/uni-app';
const schoolId = ref(0);
onLoad((options) => {
	// console.log('options', options);
	schoolId.value = options.schoolId;
	// userVestFun();
});
onShow(() => {
	console.log(999999);
	getList();
});

// 获取列表
const list = ref({});
const getList = async () => {
	const res = await getAdList2(schoolId.value);
	console.log(res.data.list);
	if (res.code == 0) {
		list.value = res.data.list;
	}
};
const bigImg = (url) => {
	uni.previewImage({
		current: 0, // 当前显示图片的索引（如果是多图）
		urls: [url] // 图片地址数组
	});
};
// 删除马甲
const showModal = ref(false);
const noDel = () => {};
const delId = ref(0);
const okDel = async () => {
	const res = await delAd(delId.value, {});
	if (res.code == 0) {
		getList();
		showModal.value = false;
		delId.value = 0;
	} else {
		uni.showToast({
			title: res.message,
			icon: 'none'
		});
	}
};
const delItem = async (id) => {
	delId.value = id;
	showModal.value = true;
	// uni.showModal({
	// 	title: '提示',
	// 	content: '确定删除',
	// 	success: async(res) =>{
	// 		if (res.confirm) {
	// 			await deleteWechatGroup(vestList.value.id, {});
	// 			userVestFun();
	// 		} else if (res.cancel) {
	// 			console.log('用户点击取消');
	// 		}
	// 	}
	// });
};

const open = () => {
	uni.navigateTo({
		url: `/admin/AD/addAd?schoolId=${schoolId.value}`
	});
};
</script>

<style lang="scss" scoped>
.adList {
	width: 100%;
	.list {
		width: 100%;
		.item {
			width: 100%;
			.itemCard {
				align-items: center;
				width: 100%;
				line-height: 55rpx;
				font-size: 28rpx;
				.itemL {
					width: 180rpx;
					color: #999;
				}
			}
			.itemImg {
				height: 202rpx;
				width: 100%;
				background: #f4f5fe;
				border-radius: 16rpx;
				overflow: hidden;
			}
			.itemBut {
				justify-content: space-around;
				align-items: center;
				padding-top: 30rpx;
				width: 100%;
				.butItem {
					width: 30%;
					height: 60rpx;
					line-height: 60rpx;
					border-radius: 30rpx;
					text-align: center;
					color: #fff;
					background-color: #01b3f8;
				}
				.delBut {
					background-color: #e74133;
				}
			}
		}
	}
	.addVest {
		position: fixed;
		bottom: 50rpx;
		right: 30rpx;
		justify-content: center;
		align-items: center;
		width: 90rpx;
		height: 90rpx;
		border-radius: 50%;
		background-color: #01b3f8;
	}
}
</style>
<style>
page {
	background-color: #f7f7f7;
}
image {
	width: 100%;
	height: 100%;
}
.modalBut {
	align-items: center;
	justify-content: space-around;
	width: 100%;
}
.custom_btn {
	width: 40%;
	height: 70rpx;
	line-height: 70rpx;
	border-radius: 35rpx;
	text-align: center;
	color: #fff;
	background-color: #3391e6;
}
.nodeBut {
	color: #515151;
	background-color: #f0f0f0;
}

.card {
	margin-bottom: 20rpx;
	background-color: #fff;
	border-radius: 15rpx;
}
.noData {
	width: 100%;
	color: #999;
	text-align: center;
}
.delBut {
	color: #fff;
	background-color: #e74133;
}
</style>
